<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('办理结果审核')"/>
    <link th:href="@{/ajax/libs/bootstrap-tagsinput/tagsinput.css}" rel="stylesheet">
    <link th:href="@{/ajax/libs/jQuery-ui/jquery-ui.css}" rel="stylesheet">

    <style>
        label {
            font-weight: bold;
        }

        @font-face {
            font-family: 'huawen';
            src: url("/fonts/huawen.woff2");
        }
        .add-wfTag {
            color: #fff;
            background-color: #3e94c3;
            border-color: #12a1d5;
        }
        .commonTag {
            margin: 5px;
            cursor: pointer;
        }
    </style>
</head>

<body style="background-color: #F4F6FA;font-size: 13px;font-family:'huawen' ;font-weight: bold">
<div class="main-content" style="margin: 0;padding: 0">

    <form id="form-user-add" th:object="${sendBackEty}" class="form-horizontal" style="background-color: #F4F6FA">
        <input type="hidden" id="wfId" th:field="*{wfId}"/>
        <input type="hidden" name="pkId" th:value="*{pkId}"/>
        <input type="hidden" name="telId" th:value="${workFormEty.getDealPk}">
        <input type="hidden" name="backState" id="backState"/>
        <input type="hidden" name="sbdeptName" id="sbdeptName" th:field="*{sbdeptName}"/>
        <div class="col-sm-12" style="display: flex">
            <div class="col-sm-12 entering-page">
                <!--    回复电话工单    -->
                <div class="col-sm-12 tltieBoder">
                    <div class="blueBorder"></div>
                    <h4 style="margin:0 0 0 10px">工单基本信息</h4>&nbsp;<button class="btn btn-sm btn-primary" onclick="lookWorkNo()">查看详情</button>
                    <div style="margin-left: 20px;">
                        <button type="button" class="btn btn-sm add-wfTag" onclick="makeTag()">打标签
                        </button>
                    </div>
                </div>
                <!--工单标签-->
                <div class="col-sm-12">
                    <div class="form-group col-sm-12">
                        <label class="col-sm-3 control-label entering-pd" style="margin-left: -15px;">该工单标签</label>
                        <div class="col-sm-9 card card-body">
                            <th:block th:if="${wfTag} != null" th:each="item : ${wfTag}">
                                <span class="badge badge-pill badge-light commonTag" th:title="${item['tagName']}" th:value="${item['tagNo']}">[[${item['tagName']}]]</span>
                            </th:block>
                        </div>
                    </div>
                </div>
                <!--工单编号、工单性质-->
                <div class="form-group col-sm-12">
                    <!--工单编号-->
                    <label class="col-sm-3 control-label entering-pd">工单编号：</label>
                    <div class="col-sm-1">
                        <span class="tworkformprocess-span">[[${workFormEty.workFormNo}]]</span>
                    </div>
                    <!--工单性质-->
                    <label class="col-sm-3 control-label entering-pd">工单性质：</label>
                    <div class="col-sm-1">
                        <span class="tworkformprocess-span">[[${workFormEty.setProName}]]</span>
                    </div>
                </div>
                <!--工单主题-->
                <div class="form-group col-sm-12">
                    <label class="col-sm-3 control-label entering-pd">工单主题：</label>
                    <div class="col-sm-9">
                        <span class="tworkformprocess-span">[[${workFormEty.wsTopic}]]</span>
                    </div>
                </div>
                <!--交办次序、办理时限-->
                <div class="form-group col-sm-12">
                    <label class="col-sm-3 control-label entering-pd">交办次序：</label>
                    <div class="col-sm-1">
                        <span class="tworkformprocess-span">[[*{seqName}]]</span>
                    </div>
                    <label class="col-sm-3 control-label entering-pd">办理时限：</label>
                    <div class="col-sm-3">
                        <span class="tworkformprocess-span">[[*{#dates.format(backLimit,'yyyy-MM-dd HH:mm:ss')}]]</span>
                    </div>
                </div>
                <!--承办单位-->
                <div class="form-group col-sm-12">
                    <label class="col-sm-3 control-label  entering-pd">承办单位：</label>
                    <div class="col-sm-6">
                        <span class="tworkformprocess-span">[[*{sbdeptName}]]</span>
                    </div>
                </div>
                <!--办理性质、回复时间-->
                <div class="form-group col-sm-12">
                    <label class="col-sm-3 control-label entering-pd">办理性质：</label>
                    <div class="col-sm-1">
                        <span class="tworkformprocess-span">[[*{sortName}]]</span>
                    </div>
                    <label class="col-sm-3 control-label entering-pd">回复时间：</label>
                    <div class="col-sm-3">
                        <span class="tworkformprocess-span">[[*{#dates.format(backTime,'yyyy-MM-dd HH:mm:ss')}]]</span>
                    </div>
                </div>
                <!--责任部门、联系电话-->
                <div class="form-group col-sm-12">
                    <label class="col-sm-3 control-label entering-pd">责任部门：</label>
                    <div class="col-sm-1">
                        <span class="tworkformprocess-span">[[*{bdutyDept}]]</span>
                    </div>
                    <label class="col-sm-3 control-label entering-pd">联系电话：</label>
                    <div class="col-sm-1">
                        <span class="tworkformprocess-span">[[*{bdutyTel}]]</span>
                    </div>
                </div>
                <!--来信内容-->
<!--                <div class="form-group col-sm-12">-->
<!--                    <label class="col-sm-3 control-label entering-pd">来信内容：</label>-->
<!--                    <div class="col-sm-7">-->
<!--                            <textarea th:field="${workFormEty.fmContent}" maxlength="3500"-->
<!--                                      class="form-control opinion"-->
<!--                                      cols="60"-->
<!--                                      rows="3"></textarea>-->
<!--                    </div>-->
<!--                </div>-->
                <div class="form-group col-sm-12">
                    <label class="col-sm-3 control-label entering-pd">回复内容：</label>
                    <div class="col-sm-7">
                            <textarea th:field="*{backDesc}" maxlength="3500"
                                      class="form-control opinion"
                                      cols="60"
                                      rows="3"></textarea>
                    </div>
                </div>
                <div class="form-group col-sm-12">
                    <label class="col-sm-3 control-label entering-pd">备注：</label>
                    <div class="col-sm-7">
                        <input th:value="*{backRemark}" name="backRemark" type="text"
                               class="form-control">
                        <span>退单理由、特殊说明等</span>
                    </div>
                </div>
                <!--    审查结论    -->
                <div class="col-sm-12 tltieBoder">
                    <div class="blueBorder"></div>
                    <h4 style="margin:0 0 0 10px">审查结论</h4>
                </div>
                <div class="col-sm-12">
                    <div class="form-group">
                        <label class="col-sm-3 control-label entering-pd">审查意见：</label>
                        <div class="col-sm-6">
                            <input type="text" id="opinion" name="opinion" class="form-control">
                        </div>
                    </div>
                </div>
                <div class="col-sm-12">
                    <div class="form-group">
                        <label class="col-sm-3 control-label entering-pd" style="color: red">不通过理由：</label>
                        <div class="col-sm-6">
                            <input type="text" id="txtReason" name="reason" class="form-control">
                        </div>
                    </div>
                </div>
                <!--按钮-->
                <div class="col-sm-12" style="display: flex;justify-content: space-around;margin-bottom: 10px;">
                    <div class="form-group">
                        <div class="col-sm-4"
                             style="display: flex;justify-content: space-around;margin:10px 0px 10px 150px">
                            <button type="button" class="btn btn-sm btn-info" onclick="passOrNot(1)">通过</button>&nbsp;&nbsp;&nbsp;&nbsp;
                            <button type="button" class="btn btn-sm btn-info" th:if="${pSendBackEty!=null}" onclick="passOrReply()" style="margin-right: 15px;">通过并再回</button>
                            <button type="button" class="btn btn-sm btn-success" onclick="passOrNot(-1)">不通过</button>&nbsp;&nbsp;&nbsp;&nbsp;
                            <button type="button" class="btn btn-sm btn-light" onclick="closeItem()">关闭</button>&nbsp;&nbsp;&nbsp;&nbsp;
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

<script th:src="@{/ajax/libs/layui/laydate.js}"></script>
<th:block th:include="include :: footer"/>
<script th:src="@{/ajax/libs/bootstrap-tagsinput/tagsinput.min.js}"></script>
<script th:src="@{/ajax/libs/jQuery-ui/jquery-ui.js}"></script>
<script th:src="@{/js/extension.js}"></script>

<script>
    var prefix = ctx + "gaoxin/system/mTelWF";

    function passOrNot(flag) {
        var act = parseInt(flag);
        if (act < 1) {
            if ($("#txtReason").val().length < 1) {
                $.modal.alertWarning("请输入不通过理由");
                return false;
            }
            $("#opinion").val("不同意");
            $("#backState").val("22");
        } else {
            if ($("#opinion").val().length < 1) {
                $("#opinion").val("同意");
                $("#backState").val("21");
            }
            $("#opinion").val("同意");
            $("#backState").val("21");
        }
        if ($.validate.form()) {
            let url = prefix + "/rCity/sendBackChkJson";
            let data = $('#form-user-add').serializeArray();
            $.operate.saveTab(url, data, refreshTListSonOver);
        }
    }
    //查看详情
    function lookWorkNo(){
        var idWF=$("#wfId").val();
        parent.layer.open({
            type: 2,
            area: ['90%','90%'],
            title: '电话工单详情',
            content:'/gaoxin/system/test/caseDetail/'+idWF,
            shadeClose: true
        });
    }

    // 添加工单标签
    function makeTag(){
        var telId = $("[name='telId']").val();
        var url = ctx + "system/tag/addTelWFTag?telId=" + telId;
        var title = "添加工单标签";
        $.modal.open(title,url, '800', '500',callback);
    }

    function callback(index, layero){
        var iframeWin = layero.find('iframe')[0];
        iframeWin.contentWindow.submitHandler();
    }

    function passOrReply(){
        var btn = ['<i class="fa fa-close"></i> 关闭'];
        var sendId = $("[name='pkId']").val();
        var wfId = $("#wfId").val();
        var url = prefix + "/rCity/passOrReply?sendId="+sendId+"&wfId="+wfId;
        var options = {
            title: '通过并再回',
            width: "1200",
            height: "500",
            url: url,
            btn: btn,
            skin: 'layui-layer-gray',
            yes: function (index, layero) {
                $.modal.close(index);
            }
        };
        $.modal.openOptions(options);
    }

    // 刷新下级已办毕-待处理列表
    function refreshTListSonOver() {
        var navFrame = $('.NAP_iframe[data-id="/gaoxin/system/cmnTab/tListSonOverTab"]', parent.document).contents().find('#navFrame')[0];
        navFrame.contentWindow.$.table.refresh();
    }
</script>
</body>
</html>

